import { LeftOutlined, RightOutlined } from '@ant-design/icons';
import { Button } from 'antd';
import { FC } from 'react';

import './style/index.less';

export interface PrevNextNavProps {
  current: number;
  lastIndex: number;
  onPrevClick?: () => void;
  onNextClick?: () => void;
}

const PrevNextNav: FC<PrevNextNavProps> = ({ current, lastIndex, onNextClick, onPrevClick }) => {
  return (
    <section className="prev-next-nav">
      {onPrevClick ? (
        <Button type="primary" className="prev" disabled={current === 0} onClick={onPrevClick}>
          <LeftOutlined /> 上一条
        </Button>
      ) : null}
      {onNextClick ? (
        <Button type="primary" className="next" disabled={current === lastIndex} onClick={onNextClick}>
          下一条 <RightOutlined />
        </Button>
      ) : null}
    </section>
  );
};
export default PrevNextNav;
